import { Directive, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core';
import { NgStyle } from '@angular/common';

@Directive({
  selector: '[el-eader]',
  host: { class: 'el-header' },
  providers: [NgStyle],
})
export class HeaderDirective implements OnChanges, OnInit {
  private ngStyle: any;
  @Input() height: string = '60px';
  private hostStyles: any;
  constructor(ngStyle: NgStyle) {
    this.ngStyle = ngStyle;
  }

  ngOnChanges(changes: SimpleChanges): void {
    this.colletClasses();
  }


  ngOnInit(): void {
    this.colletClasses();
  }

  colletClasses() {
    this.hostStyles = {
      height: this.height,
    };
    this.ngStyle.ngStyle = this.hostStyles;
    this.ngStyle.ngDoCheck();
  }

}
